<template>
	<view class="terminal-state">
		<u-toast ref="uToast"></u-toast>
		<u-no-network></u-no-network>

		<scroll-view class="home__grid-group mt-20" scroll-y @scrolltolower="onScrolltolower">
			<view>
				<view class="u-margin-20" v-for="(item,index) in terminalList" :key="index">
					<view class="">
						{{item.date}}
						<u-cell-item :title="subItem.childUserName" class="terminal-state__item "
							:value="subItem.number" :label="subItem.createTime" v-for="(subItem,_index) in item.list"
							:key="index" bg-color="white" :value-style="value_style" @click="goDetail(subItem)">
						</u-cell-item>

					</view>


				</view>
				<u-loadmore :status="status" />
			</view>
		</scroll-view>

	</view>
</template>

<script>
	export default {
		components: {

		},
		data() {
			return {
				value_style: {
					color: "#9D60FF"
				},
				src: "/static/image/home/icon_scan.png",
				thumb: "/static/image/home/icon_terminal_status.png",
				pageNo: 1,
				pageSize: "10",

				terminalList: [],
				scrollTop: 0,
				status: "loadmore",
				terminalOperType: "ISSUE", //0 ISSUE 分拨 //RECOVER 回拨
			}
		},
		onReachBottom() {
			this.onScrolltolower();
		},
		mounted() {
			let type = this.$route.query.type;
			console.log("type=" + type)
			if (type == '2') {
				uni.setNavigationBarTitle({
					title: '回拨记录' // 设置页面标题为'页面标题'
				});
			}
			this.terminalOperType = type == "1" ? "ISSUE" : "RECOVER";
			this.queryTerminalOperRecord();
		},
		methods: {
			goDetail(item) {

				this.$u.route('pages/main/terminal/terminalAllocatedDetail', {
					"batchNo": item.batchNo
				})
			},
			onPageScroll(e) {
				this.scrollTop = e.scrollTop;
			},
			onScrolltolower() {
				this.status = "loading";
				this.queryTerminalOperRecord();
			},
			queryTerminalOperRecord() {

				let _that = this;
				_that.$zx.terminal_api.queryTerminalOperRecord(this.pageNo, this.pageSize, this.terminalOperType).then(
					(
						data) => {

						_that.terminalList = _that.terminalList.concat(data);
						// console.log("data=" + JSON.stringify(_that.terminalList))
						if (data.length !== 0) {
							this.status = "loadmore";
							this.pageNo += 1;
						} else {
							this.status = "nomore";
						}
					});
			},


		},
	}
</script>

<style scoped lang="scss">
	.terminal-state {
		&__header {
			padding: 20rpx;
			background-color: white;
		}

		&__item {
			background-color: white;
			border-radius: 20rpx;
			margin-top: 20rpx;
			padding: 20rpx;
		}
	}
</style>